<!DOCTYPE html>
<head>
	<meta charset="utf-8">
	<title>秀付宝</title>
	<link rel="stylesheet" type="text/css" href="../vendor/bootstrap/css/bootstrap.css">
	<link rel="stylesheet" type="text/css" href="../vendor/morris/morris.css">
	<link rel="stylesheet" type="text/css" href="../css/common.css">
	<link rel="stylesheet" type="text/css" href="../css/personal.css">
	<link rel="icon" type="image/x-icon" href="../img/xiufubao.ico">
</head>
<body>
	<!-- toolbar -->
	<div class="toolbar">
		<div class="contain">
			<p class="toplink">
				<a href="#">秀付宝钱包</a>
			</p>
			<ul class="topmenu">
				<li class="topmenu-item">
					<a href="#">你好</a>
				</li>
				<li class="topmenu-item topmenu-item-medium">
					<a href="#">我的秀付宝</a>
				</li>
				<li class="topmenu-item topmenu-item-medium">
					<a href="#">服务大厅</a>
				</li>
				<li class="topmenu-item topmenu-item-last">
					<a href="login.html">安全退出</a>
				</li>
			</ul>
		</div>
	</div>
	<!-- end of toolbar -->

	<!-- header -->
	<div class="header">
		<div class="contain header-wrap">
			<div class="logo">
				<a href="#"></a>
			</div>
		</div>
	</div>
	<!-- header -->

	<!-- banner -->
	<div class="banner">
		<div class="contain banner-content">
			<div class="banner-portrait">
				<a href="#" title="">
					<img src="../img/seller.jpg" alt="">
				</a>
			</div>
			<div class="banner-main">
				<div class="banner-main-hello">
					<p class="username">下午好，<a href="#">喜洋洋</a></p>
					<div class="notice">
						<a href="#" title="">转账看头像，安全有保障 修改头像</a>
					</div>
				</div>
				<div class="banner-main-detail">
					<div class="mr-5 pull-left">
						<a href="#" title="">账户名：188****1234</a>
					</div>
					<i class="separator-20 pull-left">|</i>
					<div class="pull-left">
						上次登录时间：2015.02.08 16:39:24
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- end of banner -->

	<div class="contain assets">
		<table class="assets-table">
			<tbody>
				<tr>
					<td class="assets-balance">
						<div class="td-title">
							<h3>账户余额</h3>
						</div>
						<div class="td-content">
							<span class="mr-20"><strong id="money-start">5467.55</strong> 秀币</span>
							<button class="btn btn-warning" type="button" data-toggle="modal" data-target="#recharge">充值</button>
							<button class="btn btn-default" type="button" data-toggle="modal" data-target="#withdraw-cash">提现</button>
						</div>
					</td>
					<td class="assets-pcredit">
						<div class="td-title">
							<h3>其他账户</h3>
						</div>
						<div class="td-content">
							<ul>
								<li><span class="glyphicon glyphicon-credit-card"></span>银行卡：2张</li>
								<li><span class="glyphicon glyphicon-usd"></span>好料购账户：2个</li>
								<li><span class="glyphicon glyphicon-tree-conifer"></span>保险账户：0个</li>
							</ul>
						</div>
					</td>
				</tr>
			</tbody>
		</table>
	</div>

	<div class="contain donut">
		<div class="panel panel-default">
			<div class="panel-heading">秀币分类统计</div>
		  	<div class="panel-body">
		  		<div class="column-left">
		            <div id="donut-main" style="height:220px"></div>
		        </div>
		        <div class="column-right">
		            <ul class="donut-info" id="donut-info">
		                <li>
		                    <div class="color-block cz-color pull-left"></div>
		                    <span class="pl-10">充值</span>
		                    <span class="pull-right"><span id="amount1">130</span> 秀币</span>
		                </li>

		                <li>
		                    <div class="color-block tx-color pull-left"></div>
		                    <span class="pl-10">提现</span>
		                    <span class="pull-right"><span id="amount2">200.3</span> 秀币</span>
		                </li>

		                <li>
		                    <div class="color-block jy-color pull-left"></div>
		                    <span class="pl-10">交易</span>
		                    <span class="pull-right"><span id="amount3">500.34</span> 秀币</span>
		                </li>
		            </ul>
		        </div>
		  	</div>
		</div>
    </div>


	<div class="contain trade">
		<div class="panel panel-default">
		  	<div class="panel-body">
		    	<div role="tabpanel">
				  	<!-- Nav tabs -->
				  	<ul class="nav nav-tabs" role="tablist">
					    <li role="presentation" class="active"><a href="#tab1" aria-controls="home" role="tab" data-toggle="tab">最近交易记录</a></li>
					    <li role="presentation"><a href="#tab2" aria-controls="profile" role="tab" data-toggle="tab">充值记录</a></li>
					    <li role="presentation"><a href="#tab3" aria-controls="messages" role="tab" data-toggle="tab">提现记录</a></li>
				  	</ul>

				  	<!-- Tab panes -->
				  	<div class="tab-content">
					    <div role="tabpanel" class="tab-pane active" id="tab1">
					    	<table class="table table-striped table-hover">
					    		<tr>
									<td class="now"></td>
									<td>秀付宝收入-汽车坐垫宝马5系525Li翼虎CRV</td>
									<td class="orange">+179.00</td>
									<td>交易成功</td>
									<td><a href="#" title="">详情</a></td>
								</tr>
							 	<tr>
									<td>2015.2.7 18:12:27</td>
									<td>余额宝-单次转入</td>
									<td class="orange">-55.33</td>
									<td>交易成功</td>
									<td><a href="#" title="">详情</a></td>
								</tr>
								<tr>
									<td>2015.2.6 20:34:12</td>
									<td>转账</td>
									<td class="green">+24.33</td>
									<td>交易成功</td>
									<td><a href="#" title="">详情</a></td>
								</tr>
								<tr>
									<td>2015.1.1 08:44:45</td>
									<td>余额宝-单次转入</td>
									<td class="orange">-55.33</td>
									<td>交易成功</td>
									<td><a href="#" title="">详情</a></td>
								</tr>
								<tr>
									<td>2015.12.12 20:00:00</td>
									<td>转账</td>
									<td class="green">+55.33</td>
									<td>交易成功</td>
									<td><a href="#" title="">详情</a></td>
								</tr>
								<tr>
									<td>2015.12.9 17:56:23</td>
									<td>余额宝-单次转入</td>
									<td class="orange">-55.33</td>
									<td>交易成功</td>
									<td><a href="#" title="">详情</a></td>
								</tr>
							</table>
					    </div>
					    <div role="tabpanel" class="tab-pane" id="tab2">
					    	<table class="table table-striped table-hover">
							 	<tr>
									<td>2015.2.7 12:34:54</td>
									<td>充值</td>
									<td class="green">收入</td>
									<td>40.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
								<tr>
									<td>2015.2.7 08:56:12</td>
									<td>充值</td>
									<td class="green">收入</td>
									<td>200.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
								<tr>
									<td>2015.2.5 21:34:23</td>
									<td>充值</td>
									<td class="green">收入</td>
									<td>430.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
								<tr>
									<td>2015.2.7 12:56:43</td>
									<td>充值</td>
									<td class="green">收入</td>
									<td>20.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
							</table>
					    </div>
					    <div role="tabpanel" class="tab-pane" id="tab3">
					    	<table class="table table-striped table-hover">
							 	<tr>
									<td>2015.2.6 14:23:21</td>
									<td>提现</td>
									<td class="orange">支出</td>
									<td>40.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
								<tr>
									<td>2015.2.4 22:45:32</td>
									<td>提现</td>
									<td class="orange">支出</td>
									<td>200.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
								<tr>
									<td>2015.2.1 11:11:11</td>
									<td>提现</td>
									<td class="orange">支出</td>
									<td>430.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
								<tr>
									<td>2015.1.23 13:45:02</td>
									<td>提现</td>
									<td class="orange">支出</td>
									<td>20.00</td>
									<td>中国银行 ...5943</td>
									<td>成功</td>
								</tr>
							</table>
					    </div>
				  	</div>
				</div>
		  	</div>
		</div>
		
	</div>

	<footer>
		<div class="contain">
			<ul>
				<li class="border">关于秀付宝</li>
				<li class="border">官方博客</li>
				<li class="border">诚征英才</li>
				<li class="border">联系我们</li>
				<li class="border">开放平台</li>
				<li class="border">International Bussiness</li>
				<li>About</li>
			</ul>
			<p>秀付宝所有版权 2004-2015 ICP证</p>
		</div>
	</footer>

	<div class="modal fade bs-example-modal-lg" id="recharge" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
	  	<div class="modal-dialog modal-lg">
	    	<div class="modal-content">
	    		<div class="modal-header">
			        <h4 class="modal-title">充值</h4>
			    </div>
	      		<div class="modal-body">
			        <form class="form-horizontal">
					  	<div class="form-group">
					    	<label class="col-sm-2 control-label">充值金额</label>
					    	<div class="col-sm-4">
					      		<input type="text" class="form-control" id="recharge-money">
					    	</div>
					  	</div>
					  	<div class="form-group">
					  		<label class="col-sm-2 control-label">选择银行卡</label>
					    	<div class="radio col-sm-5">
							 	<label>
							    	<input type="radio" name="recharge-card" id="card1" checked>
							    	<img src="../img/combo.png">中国银行 <br>
							    	卡号：12384434****5943<br>
							    	卡内余额：1345元
							 	</label>
							</div>
							<div class="radio col-sm-5">
							 	<label>
							    	<input type="radio" name="recharge-card" id="card2">
							    	<img src="../img/zh.png">招商银行 <br>
							    	卡号：12784395****3283<br>
							    	卡内余额：00.00元
							 	</label>
							</div>
							<div class="radio col-sm-5 col-sm-offset-2">
							 	<label>
							    	<input type="radio" name="recharge-card" id="card2">
							    	<img src="../img/gh.png">工商银行 <br>
							    	卡号：23942934****3428<br>
							    	卡内余额：100.00元
							 	</label>
							</div>
					  	</div>
					</form>
					<div class="alert alert-success alert-dismissible" role="alert" style="display: none;">
					  	<button type="button" class="close" data-dismiss="alert" aria-label="Close">
					  		<span aria-hidden="true">&times;</span>
					  	</button>
					  	充值成功！
					</div>
		      	</div>
		      	<div class="modal-footer">
			        <button type="button" class="btn btn-default recharge-close" data-dismiss="modal">关闭</button>
			        <button type="button" class="btn btn-warning recharge-ok">确定</button>
		      	</div>
	   		</div>
	  	</div>
	</div>
	
	<div class="modal fade bs-example-modal-lg" id="withdraw-cash" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
	  	<div class="modal-dialog modal-lg">
	    	<div class="modal-content">
	    		<div class="modal-header">
			        <!-- <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> -->
			        <h4 class="modal-title">提现</h4>
			    </div>
	      		<div class="modal-body">
			        <form class="form-horizontal">
					  	<div class="form-group">
					    	<label class="col-sm-2 control-label">提现金额</label>
					    	<div class="col-sm-4">
					      		<input type="text" class="form-control" id="withdraw-money">
					    	</div>
					  	</div>
					  	<div class="form-group">
					  		<label class="col-sm-2 control-label">选择银行卡</label>
					    	<div class="radio col-sm-5">
							 	<label>
							    	<input type="radio" name="recharge-card" id="card1" checked>
							    	<img src="../img/combo.png">中国银行 <br>
							    	卡号：12384434****5943<br>
							    	卡内余额：1345元
							 	</label>
							</div>
							<div class="radio col-sm-5">
							 	<label>
							    	<input type="radio" name="recharge-card" id="card2">
							    	<img src="../img/zh.png">招商银行 <br>
							    	卡号：12784395****3283<br>
							    	卡内余额：00.00元
							 	</label>
							</div>
							<div class="radio col-sm-5 col-sm-offset-2">
							 	<label>
							    	<input type="radio" name="recharge-card" id="card2">
							    	<img src="../img/gh.png">工商银行 <br>
							    	卡号：23942934****3428<br>
							    	卡内余额：100.00元
							 	</label>
							</div>
					  	</div>
					</form>
					<div class="alert alert-success alert-dismissible" role="alert" style="display: none;">
					  	<button type="button" class="close" data-dismiss="alert" aria-label="Close">
					  		<span aria-hidden="true">&times;</span>
					  	</button>
					  	提现成功！
					</div>
		      	</div>
		      	<div class="modal-footer">
			        <button type="button" class="btn btn-default widthdraw-close" data-dismiss="modal">关闭</button>
			        <button type="button" class="btn btn-warning withdraw-ok">确定</button>
		      	</div>
	   		</div>
	  	</div>
	</div>
	<script type="text/javascript" src="../vendor/jquery/jquery-1.11.0.js"></script>
	<script type="text/javascript" src="../vendor/bootstrap/js/bootstrap.js"></script>
	<script type="text/javascript" src="../vendor/countUp/countUp.js"></script>
	<script type="text/javascript" src="../vendor/morris/raphael.js"></script>
	<script type="text/javascript" src="../vendor/morris/morris.js"></script>
	<script type="text/javascript" src="../js/personal.js"></script>
</body>
</html>